<template>
  <view class="wrap">
    <u-swiper
      :list="list"
      mode="dot"
      indicator-pos="bottomRight"
      height="300"
      img-mode="aspectFill"
    ></u-swiper>
    <view class="btn">
      <u-button
        v-if="roleId === 3"
        type="primary"
        :ripple="true"
        plain
        @click="toSpace"
        >场地管理</u-button
      >
    </view>
    <view class="charts-box" v-if="roleId === 1 && showCharts === true">
      <qiun-data-charts
        type="radar"
        :chartData="chartData"
        :loadingType="5"
        :echartsH5="true"
        :echartsApp="true"
        background="none"
      />
    </view>
    <view class="charts-box" v-if="roleId === 2 && showCharts === true">
      <qiun-data-charts
        type="column"
        :chartData="chartData2"
        :loadingType="5"
        :echartsH5="true"
        :echartsApp="true"
        background="none"
      />
    </view>
    <view class="charts-box" v-if="roleId === 3">
      <qiun-data-charts
        type="pie"
        :chartData="chartData3"
        :loadingType="5"
        :echartsH5="true"
        :echartsApp="true"
        background="none"
      />
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      chartData: {
        categories: ["进球", "助攻", "抢断", "失误", "犯规"],
        series: [
          {
            name: "次数",
            data: [],
          },
        ],
      },
      chartData2: {
        categories: ["球队总人数", "球员数量", "教练人数", "获胜场数"],
        series: [
          {
            name: "数量",
            data: [],
          },
        ],
      },
      chartData3: {
        series: [
          {
            data: [
              {
                name: "普通球员",
                value: 0,
              },
              {
                name: "教练员",
                value: 0,
              },
              {
                name: "管理员",
                value: 0,
              }
            ],
          },
        ],
      },
      // 当前选中导航索引
      current: 0,
      list: [
        "http://basketball.mooncode.cn/swiper1.png",
        "http://basketball.mooncode.cn/swiper2.png",
        "http://basketball.mooncode.cn/swiper3.png",
        "http://basketball.mooncode.cn/swiper4.png",
      ],
      roleId: 0,
      // 判断是否有数据显示在图表上
      showCharts: false,
    };
  },
  methods: {
    // 首先获取用户信息
    async getUserInfo() {
      const { data } = await this.$request({
        url: "/user/currentUser",
      });
      // 保存用户信息
      let userInfo = {
        userid: data.id,
        roleid: data.roles[0].id,
      };
      this.roleId = userInfo.roleid;
      if (this.roleId === 1) {
        this.getCurrentPlayer();
      } else if (this.roleId === 2) {
        this.getCurrentTeam();
      } else {
        this.getAllUserNum();
      }
      uni.setStorageSync("userInfo", userInfo);
    },

    // 获取球员个人信息
    async getCurrentPlayer() {
      const { data } = await this.$request({
        url: "/playerinfo/currentPlayer",
      });
      if (data.code !== 500 && data) {
        this.showCharts = true;
        this.chartData.series[0].data.push(
          data.match_goals,
          data.match_assist,
          data.match_steal,
          data.match_mistake,
          data.match_foul
        );
      }
    },

    // 获取当前用户所在球队信息
    async getCurrentTeam() {
      const { data } = await this.$request({
        url: "/team/currentTeam",
        data: {
          rid: this.roleId,
        },
      });
      if (data.code !== 500 && data) {
        this.showCharts = true;
        let len = data.playerinfos.length;
        this.chartData2.series[0].data.push(len + 1, len, 1, data.winNum);
      }
    },

    // 获取所有用户数量
    async getAllUserNum() {
      const {data} = await this.$request({
        url: '/user/'
      })
      data.forEach(item => {
        if(item.roles[0].name === "ROLE_ADMIN") {
          this.chartData3.series[0].data[2].value++;
        } else if(item.roles[0].name === "ROLE_COACH") {
          this.chartData3.series[0].data[1].value++;
        } else {
          this.chartData3.series[0].data[0].value++;
        }
      })
    },

    // 跳转场地管理
    toSpace() {
      uni.navigateTo({
        url: "/pages/space/index",
      });
    },
  },
  onLoad() {
    this.getUserInfo();
  },
};
</script>

<style scoped lang="scss">
.wrap {
  width: 100%;
  height: 100vh;
  padding: 15rpx 30rpx;

  .btn {
    margin-top: 30rpx;
  }

  .charts-box {
    width: 100%;
    height: 300px;
  }
}


</style>
